<template>
  <!--&lt;!&ndash;-->
  <!--  1.App.vue可以用来布局页面-->
  <!--  2.<router-view/>是路由指令，将路由到的页面展示/替换到<router-view/>-->

  <!--&ndash;&gt;-->
  <!--<nav>-->
  <!--  <router-link to="/">Home</router-link> |-->
  <!--  <router-link to="/about">About</router-link>-->
  <!--</nav>-->
  <!--<router-view/>-->
  <div>
  <!--  引入Header组件-->
  <!--  头部-->
    <Header/>

    <!--主体-->
    <!--display: flex 平分容器内可用空间，不写这个就一直从上到下放图标，写这个可以分左右布局-->
    <div style="display: flex">
      <!--侧边栏-->
      <Aside/>
      <!--内容区 这个部分通过路由展示，路由到HomeView.vue-->
      <router-view style="flex: 1"/>
    </div>

  </div>
</template>

<style>

</style>
<script>
  import Header from "@/components/Header.vue";
  import Aside from "@/components/Aside.vue";
  export default {
    name:"Layout",
    components:{ //导出
      Header,
      Aside
    }
  }
</script>